<script setup>
	import {
		computed,
		ref
	} from 'vue'
	import {
		onLoad,
		onShow
	} from "@dcloudio/uni-app"
	import {
		useUserStore
	} from '@/pages_nbst/store/user.js'
	import {
		getChapterFavQuestionReq,
		favQeustionReq,
		getMainChapterReq
	} from "@/pages_nbst/api/my.js"

	let params = {
		type: 0
	}
	let onshow = true
	onLoad(q => {
		getMainChapter()
		onshow = false
	})
	onShow(() => {
		if (onshow) {
			getMainChapter()
		}else {
			onshow = true
		}
	})

	const chapterList = ref([])
	const getMainChapter = () => {
		getMainChapterReq(params).then(res => {
			if (res?.id) {
				chapterList.value = res.main_chapter.map(v => {
					return {
						id: v.id,
						index: v.index,
						label: v.label,
						fav: 0
					}
				})

				getChapterFavQuestionReq({
					chapterIds: chapterList.value.map(v => v.id).join(',')
				}).then(res => {
					chapterList.value.forEach(v => {
						let fav = 0
						res.forEach(vv => {
							if (vv.chapter_id_index.startsWith(`${v.id};`)) {
								fav++
							}
						})
						v.fav = fav
					})
				})

			} else {
				chapterList.value = []
			}
		})
	}

	const user = useUserStore()
	const subsectionList = ref([])
	if (user.gradeId === 1) {
		subsectionList.value = ['教育综合']
	} else {
		subsectionList.value = ['教育综合', user.subject]
	}

	const onHandleSubsectionChange = (v) => {
		if (subsectionCurrent.value !== v) {
			subsectionCurrent.value = v;
			params.type = v
			getMainChapter()
		}
	}
	const subsectionCurrent = ref(0)

	const onClickReExam = (item) => {
		if (item.fav > 0) {
			uni.navigateTo({
				url: '/pages_nbst/views/my/reexam?type=fav',
				success: function(res) {
					getChapterFavQuestionReq({
						chapterIds: item.id,
						detail: 1,
					}).then(list => {
						// 通过eventChannel向被打开页面传送数据
						res.eventChannel.emit('acceptDataFromOpenerPage', {
							list: list.map(v => {
								v.question_detail.options.forEach(vv => {
									vv.answer = 0
								})
								return {
									pageId: v.page_id,
									examId: v.exam_id,
									bookQuestionId: v.book_question_id,
									questionId: v.question_detail.id,
									type: v.question_detail.type,
									content: v.question_detail.content,
									options: v.question_detail.options,
									analysis: v.question_detail.analysis,
								}
							})
						})
					})
				}
			})
		}
	}
</script>

<template>
	<uv-subsection :list="subsectionList" mode="subsection" :current="subsectionCurrent"
		@change="onHandleSubsectionChange" font-size="20" active-color="#6f95c2" />
	<view class="main">
		<view class="box" v-for="(item, index) in chapterList" :key="index">
			<view class="box-label">
				<view style="color: #6f95c2;font-size: 40rpx;font-weight: bolder;">{{item.label}}</view>
				<view style="font-size: 26rpx;">
					收藏量：<span style="color: #6f95c2;">{{item.fav}}道</span>
				</view>
			</view>
			<view class="box-btn" @click="onClickReExam(item)">重新答题</view>
		</view>
	</view>
</template>

<style scoped lang="scss">
	.main {
		padding: 20rpx;
		display: flex;
		flex-direction: column;
		gap: 16rpx;
	}

	.box {
		background-color: white;
		border-radius: 20rpx;
		padding: 30rpx 40rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.box-label {
			display: flex;
			flex-direction: column;
			gap: 4rpx;
		}

		.box-btn {
			padding: 10rpx 20rpx;
			color: white;
			background-color: #6f95c2;
			border-radius: 10rpx;
			flex-shrink: 0;
		}
	}
</style>